<template name="manyicon">
	<view>
		<view class="flex p-l-r3 fixed fixed-top bg-color search-h align-center font-size " :class="{'godds-bg':goods}">
			<view class="arrow-size">
				<image src="/static/images/user.png" class="head-icon" v-if="user" @tap="clickLeftUser"></image>
				<image src="/static/images/return.png" class="return" v-if="returnButton" @tap="clickLeftReturn"></image>
			</view>
			<view class="flex justify-content title align-center">{{headTitle}}<image src="/static/images/glide.png" class="glide ml-1" v-if="glide" @tap="clickGlide"></image></view>
			<view class="right flex align-center">
				<view class="position-r flex align-center" v-if="news" @tap="clickRightNews">
					<image src="/static/images/news2x.png" class="sao" :class="{'m-r4':pictureStyle}"></image>
					<text class="red-dot border-r1" v-if="newsTips"></text>
				</view>
				<view class="position-r flex align-center" v-if="newsToGuide" @tap="goChatToGuide">
					<image src="/static/images/news2x.png" class="sao" :class="{'m-r4':pictureStyle}"></image>
				</view>
				<image src="/static/images/sao2x.png" class="sao" v-if="sao" @tap="clickRightSao"></image>
				<image src="/static/images/newsy.png" class="newsy" v-if="newsy" @tap="clickRightNewsy"></image>
				<image src="/static/images/code.png" class="sao" v-if="code" @tap="clickRightCode"></image>
				<text class="fs-2" @tap="onClickWords">{{rightWords}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	const _this = this;
	export default{
		name:"manyicon",
		props:{
			headTitle:{
				type:String,
				value : '',
			},
			user:{
				type:Boolean,
				default: false
			},
			returnButton:{
				type:Boolean,
				default: false
			},
			glide:{
				type:Boolean,
				default: false
			},
			news:{
				type:Boolean,
				default: false
			},
			newsToGuide:{
				type:Boolean,
				default: false
			},
			sao:{
				type:Boolean,
				default: false
			},
			newsy:{
				type:Boolean,
				default: false
			},
			code:{
				type:Boolean,
				default: false
			},
			rightWords:{
				type:String,
				value : '',
			},
			goods:{
				type:Boolean,
				default: false
			},
			newsTips:{
				type:Boolean,
				default: false
			},
			pictureStyle:{
				type:Boolean,
				default: true
			},
			guideId:{
				type: String,
				default: ''
			}
		},
		methods:{
			clickLeftUser() {
				this.$emit("clickLeftUser");
			},
			clickLeftReturn(){
				this.$emit("clickLeftReturn");
			},
			clickGlide(){
				this.$emit("clickGlide");
			},
			clickRightNews(){
				this.$emit("clickRightNews");
			},
			clickRightSao(){
				this.$myRequest({
					method:'POST',
					url:'/api/wxset/jsapi',
				}).then(res=>{
					if(res.data.code == 1){
						this.wxconfig = res.data.data;
						this.init(this.wxconfig);
					}else{
						this.showMessage(res.data.msg);
					}
				})
				//this.$emit("clickRightSao");
			},
			clickRightNewsy(){
				this.$emit("clickRightNewsy");
			},
			clickRightCode(){
				this.$emit("clickRightCode");
			},
			onClickWords(){
				this.$emit("onClickWords");
			},
			//微信jssdk配置信息
			init(e){
				this.$wx.config({
				   debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
				   appId: e.app_id, // 必填，公众号的唯一标识
				   timestamp: e.timestamp, // 必填，生成签名的时间戳
				   nonceStr: e.nonceStr, // 必填，生成签名的随机串
				   signature: e.signature,// 必填，签名
				   jsApiList: ["scanQRCode"] // 必填，需要使用的JS接口列表
				});
				this.openQRCode();
				this.$wx.error(function(res){
					console.log("验证失败")
				});
			},
			openQRCode(){
				let _this = this;
				this.$wx.ready(function(){
					_this.$wx.scanQRCode({
						needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
						scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码，默认二者都有
						success: function (res) {
							var result = res.resultStr.split(":"); // 当needResult 为 1 时，扫码返回的结果  result为数组，切割返回二维码内容（不要问为什么，我也不知道）
							if(result[0] == 'guide'){
								_this.saoGuide(result[1]);
							}else if(result[0] == 'merchant'){
								_this.saoStore(result[1]);
							}
						}
					})
				});
			},
			saoGuide(gid){
				this.$myRequest({
					method:'POST',
					url:'/api/guide/binding',
					data:{
						id:gid,
					},
				}).then(res=>{
					if(res.data.code == 1){
						this.showMessage('感谢您关注导游：'+res.data.data.guide.name);
					}else{
						this.showMessage(res.data.msg);
					}
				})
			},
			saoStore(storeId){
				uni.navigateTo({
					url:'../../user/scan/scan?id='+storeId
				})
			},
			goChatToGuide(){
				uni.navigateTo({
					url: '../../chatDetails/chatToGuide?id='+this.guideId
				});
			},
			showMessage(title){
				uni.showToast({
				    title: title,
				    duration: 3000,
					icon:"none",
				});
			}, 
		}
	}
</script>

<style scoped>
.sao-v{width: 60rpx;}
.head-icon{width: 48rpx;height: 48rpx;}
.glide{width: 24rpx;height: 12rpx;}
.return{width: 20rpx;height: 36rpx;}
.sao{width: 41rpx;height: 41rpx;}
.newsy{width: 45rpx;height: 45rpx;}
.arrow-size{width: 20%;line-height: 1;}
.title{width: 55%;font-size: 38rpx;line-height: 1.2;}
.right{width: 25%;display:flex;justify-content:flex-end;font-size: 36rpx;}
.red-dot{position: absolute;top: -7rpx;left: 30rpx; width: 14rpx;height: 14rpx;background-color: #FF4141;}
.godds-bg{background-color:transparent;}
</style>
